<template>
	<view class="home-container">

		<!-- 显示加盟商角色 		普通加盟商，代理商，						基建方，										场地方，							设备方，									子设备方-->
		<view v-if="auth === 'League' || auth==='Agency' || auth ==='Partner' ">
			<franchisee :auth='auth' ref='franchisee'></franchisee>
		</view>
		
		<!-- 维保角色 -->
		<view v-else-if="auth==='BeautyStore'" style="background-color: #f3f3f3;height: 100vh;">
			<view>
				<curing-list ref='beautyStore'></curing-list>
			</view>
		</view>

		<!-- 显示除了维保和加盟商角色的内容 -->
		<view class='auth-section' v-else>
			<view class="top-section-box">
				<!-- 显示的搜索导航 -->
				<i-nav ref="nav"></i-nav>
		
				<!-- #ifndef H5 -->
				<!-- 占位的线 -->
				<!-- <view class="line"></view> -->
				<!-- #endif -->
		
				<!-- 主要内容 -->
				<view class="main">
					<!-- 轮播banner -->
					<view class="banner">
						<swiper class="img-swipe" :autoplay="true" :circular="true" :indicator-dots="false"
							:interval="3000" :current="bannerCurrent" @change="swiperChange">
							<swiper-item v-for="(item, index) in banners" :key="index">
								<image :src="item" mode="widthFix"></image>
							</swiper-item>
						</swiper>
						<view class="dots-container flex flex-jc-c flex-ai-c">
							<view v-for="(item, index) in banners" :key="index">
								<view :class="['dot', index === bannerswiperCurrent ? 'active' : '']"></view>
							</view>
						</view>
					</view>
		
					<!-- 货源服务 -->
					<link-card title="货源服务" :data="linkDatas" :auth="auth"></link-card>
		
					<!-- 自营加盟的显示 -->
					<link-card v-if="auth === 'RepairStore'" title="门店服务">
						<!-- 扫一扫 -->
						<view slot="body" class="md-sys">
							<view class="SearchScan">
								<view class="selectCar">
									<text>川</text>
									<u-icon name="arrow-down-fill" size="20" color="#9A9A9A"></u-icon>
								</view>
								<view><input class="search" placeholder="请输入车牌号" placeholder-class="placeholder" />
								</view>
								<view class="scanCar flex flex-dir-c flex-jc-c">
									<i-icon icon="iconshouye-saoma" size="40rpx"></i-icon>
									<text>扫车牌</text>
								</view>
							</view>
							<button>开始接单</button>
							<view class="iconCard">
								<view>
									<i-icon icon="iconshouye-daodianjilu" size="68rpx" color="rgb(253,120,49)"></i-icon>
									<view>到店记录</view>
								</view>
								<view>
									<i-icon icon="iconshouye-mendiandingdan" size="68rpx" color="rgb(255,154,17)">
									</i-icon>
									<view>门店订单</view>
								</view>
								<view>
									<i-icon icon="iconshouye-shipeichaxun" size="68rpx" color="rgb(83,174,240)">
									</i-icon>
									<view>适配查询</view>
								</view>
								<view>
									<i-icon icon="iconshouye-yuyueguanli" size="68rpx" color="rgb(255,174,34)"></i-icon>
									<view>预约管理</view>
								</view>
							</view>
						</view>
					</link-card>
				</view>
			</view>
		
			<!-- tab列表 -->
			<view class="tabs-list-container" :style="{ height: `calc(${tabHeight}px - ${offTop-3}rpx)` }">
				<template>
					<car-store-list ref="list" :auth="auth" :offTop="offTop"></car-store-list>
				</template>
			</view>
		
			<!-- 切换城市的弹框 -->
			<!-- #ifdef APP-PLUS -->
			<u-popup v-model="switchCityShow" mode="center" width="540" height="365" border-radius="20"
				:mask-close-able="false">
				<view class="switch-city-popup flex flex-dir-c flex-jc-sa">
					<view class="title">温馨提示</view>
					<view class="content">
						您当前城市是{{ tempAddressData.address.city }}，是否切换 到当前位置？
					</view>
					<view class="btn-box flex flex-ai-c">
						<button class="btn-switch btn-switch-left" @click="handleSwitchCity(false)">不切换</button>
						<button class="btn-switch btn-switch-right" @click="handleSwitchCity(true)">切换</button>
					</view>
				</view>
			</u-popup>
			<!-- #endif -->
		
		</view>

	</view>

</template>

<script src="./index.js"></script>

<style lang="scss" scoped>
	@import './index.scss';
</style>
